import { SearchForm, Gap, Table, Button, Upload } from "@/components";
import { getColumns, getFields } from "./helper";
import { useMyTable, useRowSelection } from "@/hooks";
import {
  batchUpdate,
  getManagementList,
  report,
  updateManagement,
  start,
} from "./service";
import { ColumnsType } from "antd/es/table";
import { useState } from "react";
import { IManagement, IRecord } from "@/api";
import { TaskModal } from "./partials/TaskModal";
import { CheckModal } from "./partials/CheckModal";
import { BatchModal } from "./partials/BatchModal";
import { useNavigate } from "react-router-dom";
import { message } from "antd";

const management = () => {
  const { search, refresh, ...restAttrs } = useMyTable({
    service: getManagementList,
  });

  const rowSelection = useRowSelection({});
  const [rowData, setRowData] = useState<IManagement.ResManagementItem>();
  const [open, setOpen] = useState(false);
  const onOpen = (record?: IManagement.ResManagementItem) => {
    setRowData(record);
    setOpen(true);
  };
  const onCancel = () => {
    setRowData(undefined);
    setOpen(false);
  };

  const [checkModalOpen, setcheckModalOpen] = useState(false);
  const onCheckModalOpen = (record: IManagement.ResManagementItem) => {
    setRowData(record);
    setcheckModalOpen(true);
  };
  const onCheckModalCancel = () => {
    setRowData(undefined);
    setcheckModalOpen(false);
  };

  const [batchModalOpen, setBatchModalOpen] = useState(false);
  const onBatchModalOpen = () => {
    setBatchModalOpen(true);
  };
  const onBatchModalCancel = () => {
    setBatchModalOpen(false);
  };

  const navigate = useNavigate();
  const jumpToRecord = (path: string) => {
    navigate(path);
  };

  const onReport = async () => {
    const [err, res] = await report();
    console.log(res);
  };

  const onBatchUpdate = async ({ ids = rowSelection.selectedRowKeys, ...restData }) => {
    const [err, res] = await batchUpdate({ ids, ...restData });
    if (err) return message.error("修改失败！");
    message.success("修改成功！");
    refresh();
    rowSelection.clearSelected()
  };

  const onStart= async (data) => {
    const [err, res] = await start(data);
    if (err) return message.error("操作失败！");
    message.success("操作成功！");
  }

  return (
    <>
      <SearchForm fields={getFields()} query={search} labelWidth={105} />
      <Gap />
      <Table
        title={`上报管理列表`}
        rowKey={"id"}
        rowSelection={{
          ...rowSelection,
          // getCheckboxProps: (record) => {
          //   return { disabled: !record.state };
          // },
        }}
        scroll={{
          y: "calc(100vh - 294px)",
        }}
        extra={
          <>
            <Button
              type="primary"
              ghost
              onClick={() => {
                onOpen();
              }}
            >
              创建任务
            </Button>
            {/* <Button
              type="primary"
              ghost
              onClick={() => {
                // onOpen();
              }}
            >
              上报
            </Button> */}
            <Button
              type="primary"
              ghost
              onClick={() => {
                onBatchModalOpen();
              }}
              disabled={rowSelection.selectedRowKeys.length === 0}
            >
              批量操作
            </Button>
          </>
        }
        columns={
          getColumns(
            onOpen,
            onCheckModalOpen,
            jumpToRecord,
            onBatchUpdate,
              onStart
          ) as ColumnsType<any>
        }
        {...restAttrs}
      />
      <TaskModal
        open={open}
        onCancel={onCancel}
        data={rowData}
        refresh={refresh}
      />
      {rowData?.id && (
        <CheckModal
          open={checkModalOpen}
          onCancel={onCheckModalCancel}
          data={rowData}
        />
      )}
      <BatchModal
        open={batchModalOpen}
        onCancel={onBatchModalCancel}
        rowKeys={rowSelection.selectedRowKeys}
        onOk={onBatchUpdate}
      />
    </>
  );
};

export default management;
